 import { createApp, Directive  } from 'vue'
 import App from './App.vue'
import router from '@/router/routers'
import { createPinia } from 'pinia';

// 权限指令
import * as directives from './components/Permission'
// global css
import './assets/styles/index.scss'
// 导入element-plus
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
// pinia数据持久化
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'

// 创建vue实例
const app = createApp(App);
const pinia = createPinia();
pinia.use(piniaPluginPersistedstate);
// 挂载实例
app.use(router).use(ElementPlus).use(pinia).mount('#app');

Object.keys(directives).forEach(key => {  //Object.keys() 返回一个数组，值是所有可遍历属性的key名
  app.directive(key, (directives as { [key: string ]: Directive })[key])  //key是自定义指令名字；后面应该是自定义指令的值，值类型是string
})

for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}

